class Lbt{
    constructor(el,options={}){
        this.el=document.querySelector(el)
        this.num=1
        this.t=null
        this.init()
    }
    init(){
        this.changeimg()
        this.tbyq()
        this.mouseoverout()
    }
    changeimg(){
        this.t=setInterval(()=>{
            this.num++
            if(this.num>=7) this.num=1
            this.el.querySelector('img').src=`./imgs/img${this.num}.jpg`
            this.tbyq()
        },500)
    }
    tbyq(){
        let liObjs=this.el.querySelectorAll('li')
        liObjs.forEach((item,index)=>{
            item.className=''
        })
        liObjs[this.num-1].className='active'
    }
    mouseoverout(){
        let liObjs=this.el.querySelectorAll('li')
        liObjs.forEach((item,index)=>{
            item.onmouseover=()=>{
                clearInterval(this.t)
                liObjs.forEach((item,index)=>{
                    item.className=''
                })
                liObjs[index].className='active'
                this.el.querySelector('img').src=`./imgs/img${index+1}.jpg`
                this.num=index+1
                item.onmouseout=()=>{
                    this.changeimg()
                }
            }
        })
    }
}